/******************************************************************************************
 * Import
 ******************************************************************************************/

// module
import React, {Component} from 'react';
import {Dimensions, ImageBackground} from 'react-native';
import { Toast } from 'antd-mobile-rn';

// project
import {
    CAround, CBetween, CCenter, CColumn, CHand, CItemX, CItemY, CLine, CRow, CWrap, 
    CIcon, CImage, CSvg, CText,
    CContent, CFloat, CFooter, CHeader, CPage, CSide, 
    CEmpty, CError, CFail, CSkeleton, 
    CLabel, CButton
} from '../../library/comp';

import Licon from '../../library/comp/project/icon';


/******************************************************************************************
 * Export
 ******************************************************************************************/
export default class Me extends Component {

    /*------------------------------------------------------------------------------------
	 * 初始化
	 *-----------------------------------------------------------------------------------*/
    constructor(props) {
        super(props);
        // this.Nav = this.props.navigation;

        /**
         * state
         */
        this.state = {
            headImage:'https://wx4.sinaimg.cn/mw690/6909cd6dly1fp3jzs0r7rj20m80m8ww6.jpg',
            phone:'123456789',
            id:1
        };
    }


    /*------------------------------------------------------------------------------------
	 * 生命周期
	 *-----------------------------------------------------------------------------------*/
    componentDidMount() {
        
        // HttpTemp.get({
        //     url:'/CPage/user/detail.php',
        //     success:(res)=>{
        //         this.setState({
        //             headImage:res.data.object.set_head,
        //             phone:res.data.set_mobile,
        //             id:res.data.id
        //         })
        //         console.log('res++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++',res)
        //         console.log('this.state++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++',this.state)
        //     }
        // })
    }



    /*------------------------------------------------------------------------------------
	 * 渲染
	 *-----------------------------------------------------------------------------------*/
    render(){
        var windowWidth = Dimensions.get('window').width;
        return(
            <CPage>
                <CContent bg='#efeff4' mb='100'>
                
                    {/* 个人信息 star */}
                    <CRow style={{backgroundColor:'#505c5f'}}>
                        <ImageBackground source={require('../../assets/usertop.png')} style={{width:'100%',height:'100%'}} resizeMode='cover'>
                            {/* 设置按钮 star */}
                            <CRow x='right' pa='28 30' pt='40'>
                                <CHand  onPress={(e)=> {
                                    // Toast.info("您所在的小区暂未开启此功能");
                                    this.Nav.navigate('UserSystem');
                                }}>
                                    <CHand w='56' h='56' ra='28' oh >
                                        <CIcon width="25" height="25" color="#fff" icon={ Licon["person-center-set"] }></CIcon>
                                    </CHand>
                                </CHand>
                            </CRow>
                            {/* 设置按钮 end */}
                            {/* 头像信息 star */}
                            <CRow px='30'>
                                <CBetween>
                                    <CItemX x='left' y='center' f='1'>
                                        <CHand w='116' h='116' ra='58' oh mr='26'>
                                            <CImage source={{uri:this.state.headImage+'?l='+Math.random()}} w='116' h='116' ra='58' resizeMode='cover' style={{backgroundColor:'#efeff4'}}></CImage>
                                        </CHand>
                                        <CHand w='200' h='116' oh mr='26' y="center">
                                            <CText color='#fff' size='30'>{this.state.phone.substring(0,3)+'****'+this.state.phone.substring(7,11)}</CText>
                                        </CHand>
                                    </CItemX>
                                    <CHand top="40"   onPress={(e)=> {
                                            this.Nav.navigate('UserSetting');
                                        }}>
                                        <CItemX x='right' f='1'>
                                                <CText color='#fff' size='22'>3项未完善</CText>
                                        </CItemX>
                                    </CHand>

                                </CBetween>
                            </CRow>
                            {/* 头像信息 end */}
                            {/* 展示栏 star */}
                            <CRow pa='20 30'>
                                <CBetween pb='4'>
                                    <CItemY x='center' y='center' w='116'>
                                        <CText pt='4' color='#fff' size='36' mb='14'>0.00</CText>
                                        <CText color='#fff' size='24'>金额</CText>
                                    </CItemY>
                                    <CItemY>
                                        <CText h='40' w='2' bg='#fff'></CText>
                                        <CText color='#fff' size='24'> </CText>
                                    </CItemY>
                                    <CItemY x='center' y='center' w='116'>
                                        <CText pt='4' color='#fff' size='36' mb='14'>0</CText>
                                        <CText color='#fff' size='24'>现金红包</CText>
                                    </CItemY>
                                    <CItemY>
                                        <CText h='40' w='2' bg='#fff'></CText>
                                        <CText color='#fff' size='24'> </CText>
                                    </CItemY>
                                    <CItemY x='center' y='center' w='116'>
                                        <CText pt='4' color='#fff' size='36' mb='14'>0</CText>
                                        <CText color='#fff' size='24'>卡卷红包</CText>
                                    </CItemY>
                                </CBetween>
                            </CRow>
                            {/* 展示栏 end */}
                        </ImageBackground>
                    </CRow>
                    {/* 个人信息 end */}

                    {/* 菜单条目 star */}
                    <CRow my='5'>
                        <CItemY f='1'>


                            <CHand  w="750" bb='solid 1 #f0f0f0' onPress={(e)=> {
                                this.Nav.navigate('');
                            }}>
                                <CRow h='130' x='left' y='center' px='30' bg='#fff' f='1'>
                                    <CHand w='80' h='120' oh x='center' y='center'>
                                        <CIcon width="20" height="20" color="#888" icon={ Licon["server-moneylist"] }></CIcon>
                                    </CHand>
                                    <CHand ml='30'>
                                        <CText color='#515151' size="30">
                                            我的订单
                                        </CText> 
                                    </CHand>
                                </CRow>
                            </CHand>


                            <CHand  w="750" bb='solid 2 #f0f0f0' onPress={(e)=> {
                                this.Nav.navigate('');
                            }}>
                                <CRow h='130' x='left' y='center' px='30' bg='#fff' f='1'>
                                    <CHand w='80' h='60' oh x='center' y='center'>
                                        <CIcon width="20" height="20" color="#888" icon={ Licon["location"] }></CIcon>
                                    </CHand>
                                    <CHand ml='30'>
                                        <CText color='#515151' size="30">
                                            收货地址
                                        </CText> 
                                    </CHand>
                                </CRow>
                            </CHand>



                            <CHand  w="750" bb='solid 2 #f0f0f0' onPress={(e)=> {
                                this.Nav.navigate('');
                            }}>
                                <CRow h='130' x='left' y='center' px='30' bg='#fff' f='1'>
                                    <CHand w='80' h='60' oh x='center' y='center'>
                                        <CIcon width="20" height="20" color="#888" icon={ Licon["shop-gouwche"] }></CIcon>
                                    </CHand>
                                    <CHand ml='30'>
                                        <CText color='#515151' size="30">
                                            我的购物车
                                        </CText> 
                                    </CHand>
                                </CRow>
                            </CHand>



                        </CItemY>
                    </CRow>
                    <CRow my='10'>
                        <CItemY f='1'>

                            <CHand  w="750" bb='solid 2 #f0f0f0' onPress={(e)=> {
                                this.Nav.navigate('');
                            }}>
                                <CRow h='130' x='left' y='center' px='30' bg='#fff' f='1'>
                                    <CHand w='80' h='60' oh x='center' y='center'>
                                        <CIcon width="20" height="20" color="#888" icon={ Licon["myactivty"] }></CIcon>
                                    </CHand>
                                    <CHand ml='30'>
                                        <CText color='#515151' size="30">
                                            我的活动
                                        </CText> 
                                    </CHand>
                                </CRow>
                            </CHand>

                            <CHand  w="750" bb='solid 2 #f0f0f0' onPress={(e)=> {
                                this.Nav.navigate('');
                            }}>
                                <CRow h='130' x='left' y='center' px='30' bg='#fff' f='1'>
                                    <CHand w='80' h='60' oh x='center' y='center'>
                                        <CIcon width="20" height="20" color="#888" icon={ Licon["server-msg"] }></CIcon>
                                    </CHand>
                                    <CHand ml='30'>
                                        <CText color='#515151' size="30">
                                            我的消息
                                        </CText> 
                                    </CHand>
                                </CRow>
                            </CHand>



                        </CItemY>
                    </CRow>

                    <CRow my='10'>
                        <CItemY f='1'>

                            <CHand  w="750" bb='solid 2 #f0f0f0' onPress={(e)=> {
                                this.Nav.navigate('');
                            }}>
                                <CRow h='130' x='left' y='center' px='30' bg='#fff' f='1'>
                                    <CHand w='80' h='60' oh x='center' y='center'>
                                        <CIcon width="20" height="20" color="#888" icon={ Licon["index-help"] }></CIcon>
                                    </CHand>
                                    <CHand ml='30'>
                                        <CText color='#515151' size="30">
                                            帮助反馈
                                        </CText> 
                                    </CHand>
                                </CRow>
                            </CHand>

                            <CHand  w="750" bb='solid 2 #f0f0f0' onPress={(e)=> {
                                this.Nav.navigate('');
                            }}>
                                <CRow h='130' x='left' y='center' px='30' bg='#fff' f='1'>
                                    <CHand w='80' h='60' oh x='center' y='center'>
                                        <CIcon width="20" height="20" color="#888" icon={ Licon["person-center-share"] }></CIcon>
                                    </CHand>
                                    <CHand ml='30'>
                                        <CText color='#515151' size="30">
                                            应用分享
                                        </CText> 
                                    </CHand>
                                </CRow>
                            </CHand>


                        </CItemY>
                    </CRow>
                    {/* 菜单条目 end */}
                </CContent>

                {/* 底部TAB >>>>>>>>>>>>>>>>>>>>> */}

                {/* <FooterMain current='User' nav={this.Nav}></FooterMain> */}
            </CPage>
        )
    }
}
